<template>
	<view>
		<view class="userinfo">
		  <image src="https://ayh.wissun.net/static/ayh/750.png?1" class="tppics" mode="widthFix"/>
		  <view class="toux">
			<view class="show_headimg">
			  <image :src="wxuserinfo.headimgurl" />
			</view>
			<view class="my_nickname" style="display: none;">{{wxuserinfo.nickname}}</view>
		  </view>
		</view>
		
		<view class="itemlist">
			<view class="item_one">
				<view class="span">
					<input type="text" placeholder="请输入真实姓名"  v-model="realname" />
				</view>
			</view>
			<view class="item_one">
				<view class="span">
					<picker mode="selector" :range="sexarr"   @change="bindPickerChange">
						<input type="text" placeholder="请输入性别" disabled="true"  v-model="sexarr[index]" />
					</picker>
				</view>
			</view>
		
			<view class="item_one">
				<view class="span">
					<picker mode="date"   @change="bindDateChange">
						<input type="text" placeholder="请输入出生年月" disabled="true" id="birthday" v-model="birthday" />
					</picker>
				</view>
			</view>
			<view class="item_one">
				<view class="span" style="width: 158px;">
					<input type="number" placeholder="请授权手机号" disabled="disabled" v-model="mobile"  />
				</view>
				<view class="span">
					<button style="width: 100%;font-size: 13px;position: relative;right: 12px;top: 2px;" 
					open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">授权手机号</button>
				</view>
			</view>
			<view class="tijbtn" @click="saveuserinfo">保存</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sexarr:["男","女"],
				index:-1,
				wxuserinfo:{
					headimgurl:"",
					nickname:""
				},
				realname:"",
				mobile:"",
				birthday:""
			}
		},
		onLoad(p) {},
		onShow() {
			var wxuserinfo=uni.getStorageSync('wxuserinfo')
			if(!wxuserinfo){
			  wxuserinfo={}
			  wxuserinfo.headimgurl="https://ayh.wissun.net/static/ayh/logo(1).png";
			}
			this.wxuserinfo=wxuserinfo
			var user_id=uni.getStorageSync('user_id')
			if(user_id){
				this.getuinfo(user_id)
			}
		},
		methods: {
			//选择性别
			bindPickerChange(e){
				this.index=e.detail.value
			},
			//选择出入年月
			bindDateChange(e){
				this.birthday=e.detail.value
			},
			 //授权手机号
			getPhoneNumber(e){
				var that = this
				if(e.detail.errMsg=="getPhoneNumber:ok"){
					uni.login({
						success:(res)=>{
							let code=res.code
							var data={};
							data.code=code
							data.iv=e.detail.iv;
							data.user_id=uni.getStorageSync('user_id')
							data.encryptedData=e.detail.encryptedData;
							this.request('/api/index/decrypt_phone', data,"post").then(ret => {
								uni.setStorageSync('wx_bind_mobile', ret.info.mobile2)
								that.mobile=ret.info.mobile2
							})
						}
					})
				}else{
					uni.showToast({ title: '为更好的服务您，请您同意获取您的信息',icon:"none"})
				}
			},
			getuinfo(user_id){
				var data={}
				data.user_id=user_id
				data.openid=uni.getStorageSync("openid");
				var that = this
				this.request('/api/index/get_user_info', data,"post").then(rt => {
					var index=-1
					if(rt.info.baby_sex == "男"){
						index=0
					}else if(rt.info.baby_sex == "女"){
						index=1
					}
					console.log(rt.info)
					that.mobile=rt.info.rec_mobile
					that.birthday=rt.info.baby_birthday
					that.realname=rt.info.realname
					that.index=index
				})
			},
			saveuserinfo(){
				var data={}
				var user_id=uni.getStorageSync('user_id');
				if(user_id){
					if(this.realname == ""){
						uni.showToast({ title: '请输入真实姓名',icon:"none"})
						return
					}
					if(this.index == -1){
						uni.showToast({title: '请选择性别',icon:"none"})
						return
					}
					if(this.birthday == ""){
						uni.showToast({ title: '请选择出生年月',icon:"none"})
						return
					}
					if(this.mobile == ""){
						uni.showToast({ title: '请输入手机号',icon:"none"})
						return
					}
					data.realname=this.realname
					data.baby_sex=this.sexarr[this.index]
					data.baby_birthday=this.birthday
					data.rec_mobile=this.mobile
					data.user_id=user_id
					this.request('/api/index/update_basic_info2', data,"post").then(data => {
						uni.showToast({ title: '保存成功', })
						setTimeout(function(){
							uni.navigateBack()
						},2000)
					})
				}else{
					uni.showToast({ title: '请先登录之后再进行修改',icon:"none"})
				}
			}
		}
	}
</script>

<style>
.userinfo{
    /* background-image: url(https://ayh.wissun.net/static/ayh/icon121.png); */
    /* box-shadow: unset; */
    height: 134px;
    background-size: 100% 100%;
    width: 100%;
}
.tppics{
	width: 100%;
	position: absolute;
}
page{
    /* background: url("https://ayh.wissun.net/static/ayh/waszil.png?1"); */
	background-color: #84DCD7;
    background-size: 100% 110%;
}
.item_one .span input {
    background: unset;
    padding-left: 20px;
    color: #32467B;
    font-weight: bold;
    margin-top: 5px;
    margin-left: 10px;
}
.item_one .span input {
    height: 30px;
    border: none;
    outline: none;
    font-size: 14px;
    background: #fff;
}
.itemlist {
    width: 100%;
    margin-top: 116px;
}
.item_one {
    background: #fff;
    border-radius: 34px;
    width: 85%;
    margin: 0 auto;
    margin: 10px auto;
    height: 40px;
    font-size: 14px;
    font-family: SourceHanSansCN;
    font-weight: 400;
    color: #999999;
    display: flex;
    justify-content: space-between;
    line-height: 40px;
    border-bottom: 1px solid #EBEBEB;
}
.toux {
    margin: 0 auto;
    width: auto;
}
.show_headimg {
    width: 80px;
    height: 80px;
    background: #FFFFFF;
    border: 6px solid #FFFFFF;
    border-radius: 50%;
    margin: 0 auto;
    text-align: center;
    position: relative;
    top: 103px;
}
.show_headimg image {
    border-radius: 50%;
    width: 100%;
    height: 100%;
}
.my_nickname {
    position: relative;
    top: 92px;
    font-family: SourceHanSansCN;
    font-weight: 400;
    color: #FFFFFF;
    text-align: center;
}
.tijbtn {
    width: 170px;
    height: 40px;
    line-height: 40px;
    margin: 0 auto;
    text-align: center;
    background: #fff;
    border-radius: 20px;
    margin-top: 80px;
    color: #219ff5;
    font-weight: bold;
    position: relative;
    bottom: 20px;
}
.gologintp{
    color: #b9b9b9;
    font-weight: bold;
}
.secpp{
    display: flex;
    justify-content: space-between;
    width: 97%;
}
</style>
